<template>
  <div>
    <Table :border="true" :stripe="true" :show-header="true" :height="350" :data="tableData" :columns="tableColumns"></Table>
    <div class="add-group">
      <Button type="primary" @click="onAddManager">增加用户</Button>
    </div>
    <Modal
        title="编辑信息"
        v-model="userInfoModal" ok-text="提交" @on-ok="onModifySubmit">
        <Form ref="formCustom":model="formLeft" label-position="left" :label-width="50">
        <Form-item label="用户id">
            <Input v-model="formLeft.uid" disabled ></Input>
        </Form-item>
        <Form-item label="用户名">
            <Input v-model="formLeft.userName" ></Input>
        </Form-item>
        <Form-item label="真  名">
            <Input v-model="formLeft.realName"></Input>
        </Form-item>
        <Form-item label="组id" >
          <Input type="text" v-model="formLeft.gid"></Input>
          <span>可选:{{formLeftgids}}</span>
        </Form-item>
         <Form-item label="状态">
            <Row>
                <Col span="15">
                    <Input type="text" v-model="formLeft.status"></Input>
                </Col>
                <Col span="4" offset="1">
                    <label >0:禁用,1:启用</label>
                </Col>
            </Row>
        </Form-item>
    </Form>
    </Modal>
    <Modal
        title="编辑信息"
        v-model="addUserModal" ok-text="提交" @on-ok="onAddSubmit">
        <Form ref="formCustom":model="formAdd" label-position="left" :label-width="50">
        
        <Form-item label="用户名">
            <Input v-model="formAdd.userName" ></Input>
        </Form-item>
        <Form-item label="密  码">
            <Input v-model="formAdd.passward" ></Input>
        </Form-item>
        <Form-item label="真  名">
            <Input v-model="formAdd.realName"></Input>
        </Form-item>
        <Form-item label="组id" >
           <Input type="text" v-model="formAdd.gid"></Input>
           <span >可选:{{ formAddgids }}</span>
        </Form-item>
         <Form-item label="状态">
            <Row>
                <Col span="15">
                    <Input type="text" v-model="formAdd.status"></Input>
                </Col>
                <Col span="4" offset="1">
                    <label >0:禁用,1:启用</label>
                </Col>
            </Row>
        </Form-item>
    </Form>
    </Modal>
  </div>
 
</template>
<script>
// import VueMarkdown from 'vue-markdown'
import {getAllUser, modifyStatus, modifyManager, addManager, delManager} from '@/api/user.js'
import {getVO} from '@/common/proto-vo.js'
import {getAllUserGroup} from '@/api/group.js'
import {getUserGid} from '@/common/auth'
export default {
  data () {
    return {
      tableData: [],
      userInfoModal: false,
      addUserModal: false,
      formLeftgids: '',
      formAddgids: '',
      formLeft: {
        uid: '',
        userName: '',
        realName: '',
        gid: '',
        status: '',
        gids: ''
      },
      formAdd: {
        passward: '',
        userName: '',
        realName: '',
        gid: '',
        status: '',
        gids: ''
      },
      selectIndex: 0
    }
  },
  created () {
    getAllUser().then((data) => {
      if (!data) {
        return
      }
      let ManagerVO = getVO('ManagerVO')
      let pv = data.data.data
      let len = pv.data.length
      for (let i = 0; i < len; i++) {
        let vo = ManagerVO.decode(pv.data[i])
        this.tableData.push({
          userName: vo.userName, realName: vo.realName, gid: vo.gid.toNumber(), uid: vo.uid.toNumber(), status: vo.status
        })
      }
      console.log(this.tableData)
      this.selectIndex = 0
    })
  },
  methods: {
    onModifyStatus (index, status) {
      let uid = this.tableData[index].uid
      let gid = this.tableData[index].gid
      let selfGid = getUserGid()
      console.log('gid:', gid, ',selfGid:', selfGid)
      if (gid <= selfGid) {
        this.$Message.info('您不能操作相同权限组的成员!!!')
        return
      }
      console.log('uid:', uid)
      modifyStatus(uid, status).then((data) => {
        if (!data) {
          return
        }
        this.tableData[index].status = status
        console.log(this.tableData)
      })
    },
    onDelManager (index) {
      let uid = this.tableData[index].uid
      let gid = this.tableData[index].gid
      let selfGid = getUserGid()
      if (gid <= selfGid) {
        this.$Message.info('您不能操作相同权限组的成员!!!')
        return
      }
      console.log('uid:', uid)
      delManager(uid).then((data) => {
        if (!data) {
          return
        }
        let success = data.data.data.intValues[0]
        if (success === 1) {
          this.tableData.splice(index, 1)
          console.log(this.tableData)
        }
      })
    },
    onMondifyManager (index) {
      let vo = this.tableData[index]

      let gid = vo.gid
      let selfGid = getUserGid()
      if (gid <= selfGid) {
        this.$Message.info('您不能操作相同权限组的成员!!!')
        return
      }

      console.log('onMondifyManager:', vo)
      this.formLeft.uid = vo.uid
      this.formLeft.userName = vo.userName
      this.formLeft.realName = vo.realName
      this.formLeft.gid = vo.gid
      this.formLeft.status = vo.status
      getAllUserGroup().then((data) => {
        if (!data) {
          return
        }
        this.formLeftgids = ''
        let MGroupVO = getVO('MGroupVO')
        let pv = data.data.data
        let len = pv.data.length
        let iMax = len - 1
        for (let i = 0; i < len; i++) {
          let vo = MGroupVO.decode(pv.data[i])
          this.formLeftgids = this.formLeftgids + vo.gid.toNumber() + ':' + vo.gName
          if (i < iMax) {
            this.formLeftgids = this.formLeftgids + ','
          }
        }
        console.log('this.formLeft.gids:', this.formLeftgids)
      })

      this.userInfoModal = true
      this.selectIndex = index
    },
    onAddManager () {
      this.addUserModal = true
      getAllUserGroup().then((data) => {
        if (!data) {
          return
        }
        this.formAddgids = ''
        let MGroupVO = getVO('MGroupVO')
        let pv = data.data.data
        let len = pv.data.length
        let iMax = len - 1
        for (let i = 0; i < len; i++) {
          let vo = MGroupVO.decode(pv.data[i])
          this.formAddgids = this.formAddgids + vo.gid.toNumber() + ':' + vo.gName
          if (i < iMax) {
            this.formAddgids = this.formAddgids + ','
          }
        }
        console.log('this.formAdd.gids:', this.formAddgids)
      })
    },
    onModifySubmit () {
      console.log('onManagerModifySubmit')
      let uid = this.formLeft.uid
      let userName = this.formLeft.userName
      let realName = this.formLeft.realName
      let gid = this.formLeft.gid
      let status = parseInt(this.formLeft.status)
      modifyManager(uid, userName, realName, gid, status).then((data) => {
        if (!data) {
          return
        }
        console.log('modifyManager data：', data)
        let success = data.data.data.intValues[0]
        console.log('modifyManager result:', success)
        if (success === 1) {
          this.tableData[this.selectIndex].userName = userName
          this.tableData[this.selectIndex].realName = realName
          this.tableData[this.selectIndex].gid = gid
          this.tableData[this.selectIndex].status = status
          this.formLeft.uid = ''
          this.formLeft.userName = ''
          this.formLeft.realName = ''
          this.formLeft.gid = ''
          this.formLeft.status = ''
          this.selectIndex = 0
        }
      })
    },
    onAddSubmit () {
      console.log('onManagerAddSubmit')
      let passward = this.formAdd.passward
      let userName = this.formAdd.userName
      let realName = this.formAdd.realName
      let gid = this.formAdd.gid
      let status = parseInt(this.formAdd.status)
      console.log('onManagerAddSubmit status', status)
      addManager(userName, realName, passward, gid, status).then((data) => {
        if (!data) {
          return
        }
        console.log('addManager data：', data)
        let success = data.data.data.intValues[0]
        let uid = data.data.data.longValues[0].toNumber()
        console.log('addManager uid:', uid)
        if (success === 1) {
          this.tableData.push({
            userName: userName, realName: realName, gid: gid, uid: uid, status: status
          })
        }
        this.formAdd.passward = ''
        this.formAdd.userName = ''
        this.formAdd.realName = ''
        this.formAdd.gid = ''
        this.formAdd.status = ''
      })
    }
  },
  computed: {
    tableColumns () {
      let cols = [
        {
          title: '账号',
          key: 'userName',
          width: 150
        },
        {
          title: '姓名',
          key: 'realName',
          width: 150
        },
        {
          title: '账号ID',
          key: 'uid',
          width: 80,
          align: 'center'
        },
        {
          title: '权限组',
          key: 'gid',
          width: 80,
          align: 'center'
        },
        {
          title: '状态',
          key: 'status',
          width: 80,
          align: 'center'
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          render: (h, params) => {
            console.log(h, params)
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    // this.render(params.index)
                    // console.log(h, params)
                    this.onMondifyManager(params.index)
                  }
                }
              }, '编辑'),
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    this.onModifyStatus(params.index, 1)
                  }
                }
              }, '启用'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    this.onModifyStatus(params.index, 0)
                  }
                }
              }, '禁用'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    this.onDelManager(params.index)
                  }
                }
              }, '删除')
            ])
          }
        }
      ]
      return cols
    }
  }
}
</script>
